<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<!DOCTYPE html>
<html>
 <head>
  <title>导入课表信息</title>
  <t:base type="jquery,easyui,tools"></t:base>
   <script src="plug-in/jquery-plugs/form/jquery.form.js"></script> 
     
   
  	<style>
  		.pageTitle{
  			background-color: rgb(238,238,238);
  			height:40px;
  			line-height: 40px;
  			margin:10px;
  			border-radius: 6px;
    		padding-left: 20px;
    		font-size: 14px;
  		}
  		 
  		.flowText{
  			font-family: 'Arial Normal', Arial; font-weight: bold; color: rgb(255, 255, 255); opacity: 1;
  			text-align: right;
  		}
  		.flow{
  			background-image: url(images/courseSchedule/flow_unselect.png);
  			background-repeat: no-repeat;
  			width:130px;
  			height:30px;
  			line-height: 30px;
  			text-align: center;
  			margin-left:10px;
  			float:left;
  			margin-bottom: 10px;
  		}
  		.flow.selected{
  			background-image: url(images/courseSchedule/flow_selected.png);
  			background-repeat: no-repeat;
  			width:130px;
  			height:30px;
  			line-height: 30px;
  			text-align: center;
  		}
  		
  	 	.matchError{
  	 		color:red;
  	 	}
  	 	
  	 	.matchOK{
  	 		color: #1DC71D;
  	 	}
  	 	
  	 	.grayButton{
  	 		cursor: pointer;
    		background-color: #e5e5e5;
    		padding: 5px;
    		border-radius: 10px;
  	 	}
  	 	
  	 	.grayButton:hover{
  	 		color: black;
  	 	}
		
  	</style>
 </head>
 <body>
 
 <div class="pageTitle">导入课表</div>
 <div  class="flow" data-label="flow1"  > 
     <span class="flowText">上传课表</span>  
  </div>
   <div  class="flow selected" data-label="flow1"> 
     <span class="flowText">子项对应</span>  
  </div> 
  <div  class="flow" data-label="flow1"  > 
     <span class="flowText">导入完成</span>  
  </div>
  
  
		<table class="commonTable" id="matcherTable">
			<thead>
				<tr>
					<th>对应子项</th><th>原始名称</th><th>系统中名称</th><th>点击对应</th><th>对应状态</th>
				</tr> 
			</thead>
			<tbody>
				<tr>
					<td>课程名称</td>
					<td>	
					</td>
					<td>
						<input id="lessonId" name="lessonId" type="hidden" >               
						<input id="lessonName"  type="text" style="width: 150px" class="inputxt" 
					      readonly="readonly"   >
						<t:choose hiddenName="lessonId" hiddenid="id" url="lessonInfoController.do?goSelect" name="lessonList"
                          icon="icon-search" title="选择" textname="lessonName" isclear="false" isInit="true"  ></t:choose>
					</td>
					<td>
						<a class="grayButton matchBtn" onclick="matchLesson()">点击对应</a>
					</td>
					<td></td> 
				</tr>
				<tr>
					<td>项目名称</td><td></td>
					<td>
						<input id="teachItemId" name="teachItemId" type="hidden" >               
					     <input id="itemName"  type="text" style="width: 150px" class="inputxt" 
					      readonly="readonly" >
					     <t:choose hiddenName="teachItemId" hiddenid="id" url="dictTeachItemController.do?goSelect" name="groupList"
                          icon="icon-search" title="选择" textname="itemName" isclear="false" isInit="true"  ></t:choose>
							
					</td>
					<td>
						<a class="grayButton matchBtn" onclick="matchTeachItem()">点击对应</a>
					</td><td></td> 
				</tr>
				<tr>
					<td>实验室名称</td><td></td>
					<td>
						<input id="labId" name="labId" type="hidden" >               
					     <input id="labName"  type="text" style="width: 150px" class="inputxt" 
					      readonly="readonly" >
					     <t:choose hiddenName="labId" hiddenid="id" url="labBranchController.do?goSelect" name="labBranchList"
                          icon="icon-search" title="选择" textname="name" inputTextname="labName" isclear="false" isInit="true"  ></t:choose>
							
					</td>
					<td>
						<a class="grayButton matchBtn" onclick="matchLab()">点击对应</a>
					</td><td></td> 
				</tr>
				<tr>
					<td>上课教师</td><td></td>
					<td>
						<input id="teacherId" name="teacherId" type="hidden"  value='${task.teacher.id }'>               
					     <input id="realName"  type="text" style="width: 150px" class="inputxt" 
					      readonly="readonly" >
					     <t:choose hiddenName="teacherId" hiddenid="id" url="teacherController.do?goSelect" name="teacherList"
                          icon="icon-search" title="选择" textname="realName" isclear="false" isInit="true"  ></t:choose>
							
					</td>
					<td>
						<a class="grayButton matchBtn" onclick="matchTeacher()">点击对应</a>
					</td><td></td> 
				</tr>
				<tr>
					<td>班级名称</td><td></td>
					<td>
						<input id="gradeId" name="gradeId" type="hidden"  value='${task.grade.id }'>               
					     <input id="className"  type="text" style="width: 150px" class="inputxt" 
					      readonly="readonly"  >
					     <t:choose hiddenName="gradeId" hiddenid="id" url="dictGradeController.do?goSelect" name="deviceGradeList"
                          icon="icon-search" title="选择" textname="className" isclear="false" isInit="true"  ></t:choose>
					</td>
					<td>
						<a class="grayButton matchBtn" onclick="matchGrade()">点击对应</a>
					</td><td></td> 
				</tr>
			</tbody>
		</table>
	 
		<table class="commonTable" id="courseTable">
			<thead>
				<tr>
					<th>课程代码</th><th>课程名称</th><th>项目名称</th><th>上课时间</th><th>上课节次</th><th>上课教师</th>
					<th>实验室</th><th>班级名称</th><th>指导教师</th><th>状态</th>
				</tr> 
			</thead>
			<tbody>
				<c:forEach items="${tempCourseList}" var="c">
					<tr id="tr${c.id}" onclick="showDetail('${c.id}')">
						<td>${c.lessonNo }</td><td>${c.lessonName }</td>
						<td>${c.teachItemName }</td><td>${c.week }</td>
						<td>${c.courseOrder }</td><td>${c.teacherName}</td>
						<td>${c.labName}</td><td>${c.gradeInfo }</td>
						<td>${c.coacher}</td>
						<td>
							<c:choose>
								<c:when test="${c.isMatched == 1 }">
									<span class="matchOK">对应成功</span>
								</c:when>
								<c:otherwise>
									<span class="matchError">对应失败</span>
								</c:otherwise>
							</c:choose>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		
		<div style="text-align: center;padding-top: 20px;">
			<a class="myBtn" style="padding: 10px 20px 10px 20px;font-size:15px;" onclick="nextStep()">确定导入</a>
		</div>
		
		<script>
			var currentMatchId = null;
			function showDetail(id){
				
				currentMatchId = id;
				 var course = getMatchItem(id);
				
				 $('#matcherTable tbody tr').eq(0).find('td').eq(1).html(course.lessonName);
				 $('#matcherTable tbody tr').eq(1).find('td').eq(1).html(course.teachItemName);
				 $('#matcherTable tbody tr').eq(2).find('td').eq(1).html(course.labName);
				 $('#matcherTable tbody tr').eq(3).find('td').eq(1).html(course.teacherName);
				 $('#matcherTable tbody tr').eq(4).find('td').eq(1).html(course.gradeInfo);
				 
				 $('#lessonName').val(course.matchLessonName);
				 $('#labName').val(course.matchLabName);
				 $('#realName').val(course.matchTeacherName);
				 $('#className').val(course.matchGradeName);
				 $('#itemName').val(course.matchTeachItemName);
				 
 				 
				 //设置对应状态
				 var state = '';
				 if(course.lessonId != ''){
					 state= '<span class="matchOK">对应成功</span>'; 
					// $('#matcherTable tbody tr').eq(0).find('.matchBtn').hide();
				 }else{
					 state='<span class="matchError">对应失败</span>';
					 $('#matcherTable tbody tr').eq(0).find('.matchBtn').show();
				 }
				 $('#matcherTable tbody tr').eq(0).find('td').eq(4).html(state);
				 
				 if(course.teachItemId != ''){
					 state= '<span class="matchOK">对应成功</span>';  
					 // $('#matcherTable tbody tr').eq(1).find('.matchBtn').hide();
				 }else{
					 state='<span class="matchError">对应失败</span>';
					 $('#matcherTable tbody tr').eq(1).find('.matchBtn').show();
				 }
				 $('#matcherTable tbody tr').eq(1).find('td').eq(4).html(state);
				 
				 
				 if(course.labId != ''){
					 state= '<span class="matchOK">对应成功</span>'; 
					 //$('#matcherTable tbody tr').eq(2).find('.matchBtn').hide();
				 }else{
					 state='<span class="matchError">对应失败</span>';
					 $('#matcherTable tbody tr').eq(2).find('.matchBtn').show();
				 }
				 $('#matcherTable tbody tr').eq(2).find('td').eq(4).html(state);
				 
				 if(course.teacherId != ''){
					 state= '<span class="matchOK">对应成功</span>'; 
					 //$('#matcherTable tbody tr').eq(3).find('.matchBtn').hide();
				 }else{
					 state='<span class="matchError">对应失败</span>';
					 $('#matcherTable tbody tr').eq(2).find('.matchBtn').show();
				 }
				 $('#matcherTable tbody tr').eq(3).find('td').eq(4).html(state);
				 
				 if(course.gradeId != ''){
					 state= '<span class="matchOK">对应成功</span>'; 
					 //$('#matcherTable tbody tr').eq(4).find('.matchBtn').hide();
				 }else{
					 state='<span class="matchError">对应失败</span>';
					 $('#matcherTable tbody tr').eq(4).find('.matchBtn').show();
				 }
				 $('#matcherTable tbody tr').eq(4).find('td').eq(4).html(state); 
			}
			
			//匹配课程
			function matchLesson(){
				var lessonId = $('#lessonId').val();
				if(lessonId ==''){
					tip('请选择课程');
					return;
				} 
				$.ajax({
					url:'teachCourseScheduleController.do?matchLesson&lessonId='+lessonId+"&id="+currentMatchId,
					datatype:'json',
					success:function(data){
						data = $.parseJSON(data)
						if(data.success){ 
							 $('#matcherTable tbody tr').eq(0).find('td').eq(4).html('<span class="matchOK">对应成功</span>');
						}
 						var currentItem = getMatchItem(currentMatchId);
						console.log(currentItem)
						currentItem.lessonId = lessonId;
						currentItem.matchLessonName = $('#lessonName').val();
						checkAllMatched(currentMatchId); //检查是否都匹配了，全部匹配后，更新下面表格
					}
				});
			} 
			 
			
			//匹配实验室
			function matchLab(){
				var labId = $('#labId').val();
				if(labId ==''){
					tip('请选择实验室');
					return;
				} 
				$.ajax({
					url:'teachCourseScheduleController.do?matchLab&labId='+labId+"&id="+currentMatchId,
					datatype:'json',
					success:function(data){
						data = $.parseJSON(data)
						if(data.success){ 
							 $('#matcherTable tbody tr').eq(2).find('td').eq(4).html('<span class="matchOK">对应成功</span>');
						}
 						var currentItem = getMatchItem(currentMatchId);
 						currentItem.labId = labId;
						currentItem.matchLabName = $('#labName').val(); 
						checkAllMatched(currentMatchId); //检查是否都匹配了，全部匹配后，更新下面表格
					}
				});
			} 
			
			//实验项目
			function matchTeachItem(){
				var teachItemId = $('#teachItemId').val();
				if(teachItemId ==''){
					tip('请选择实验室项目');
					return;
				} 
				$.ajax({
					url:'teachCourseScheduleController.do?matchTeachItem&teachItemId='+teachItemId+"&id="+currentMatchId,
					datatype:'json',
					success:function(data){
						data = $.parseJSON(data)
						if(data.success){ 
							 $('#matcherTable tbody tr').eq(1).find('td').eq(4).html('<span class="matchOK">对应成功</span>');
						}
 						var currentItem = getMatchItem(currentMatchId);
 						currentItem.teachItemId = teachItemId;
						currentItem.matchTeachItemName = $('#itemName').val();  
						checkAllMatched(currentMatchId); //检查是否都匹配了，全部匹配后，更新下面表格
					}
				});
			} 
			
			//教师信息
			function matchTeacher(){
				var teacherId = $('#teacherId').val();
				if(teacherId ==''){
					tip('请选择教师');
					return;
				} 
				$.ajax({
					url:'teachCourseScheduleController.do?matchTeacher&teacherId='+teacherId+"&id="+currentMatchId,
					datatype:'json',
					success:function(data){
						data = $.parseJSON(data)
						if(data.success){ 
							 $('#matcherTable tbody tr').eq(3).find('td').eq(4).html('<span class="matchOK">对应成功</span>');
						}
 						var currentItem = getMatchItem(currentMatchId);
 						currentItem.teacherId = teacherId;
						currentItem.matchTeacherName = $('#realName').val();   
						checkAllMatched(currentMatchId); //检查是否都匹配了，全部匹配后，更新下面表格
					}
				});
			} 
			
			//班级信息
			function matchGrade(){
				var gradeId = $('#gradeId').val();
				if(gradeId ==''){
					tip('请选择班级');
					return;
				} 
				$.ajax({
					url:'teachCourseScheduleController.do?matchGrade&gradeId='+gradeId+"&id="+currentMatchId,
					datatype:'json',
					success:function(data){
						data = $.parseJSON(data)
						if(data.success){ 
							 $('#matcherTable tbody tr').eq(4).find('td').eq(4).html('<span class="matchOK">对应成功</span>');
						}
 						var currentItem = getMatchItem(currentMatchId);
 						currentItem.gradeId = gradeId;
						currentItem.matchGradeName = $('#className').val();   
						checkAllMatched(currentMatchId); //检查是否都匹配了，全部匹配后，更新下面表格
					}
				});
			} 
			 
			
			
			function getShowText(obj){
				return obj == null?"":obj;
			}
			
		 
			function nextStep(){
				//校验是否有未匹配项目
				for(var i =0;i<unmatchList.length;i++){
					var course = unmatchList[i];
					if(course.allMatch == 0){
						tip('存在未匹配课程信息，实验项目名称：'+course.teachItemName);
						return ;
					}
				}
				 
				window.location="teachCourseScheduleController.do?showImport3";
			} 
			
			//检查是否都匹配了，全部匹配后，更新下面表格
			function checkAllMatched(currentMatchId){
				for(var i =0;i<unmatchList.length;i++){
					var course = unmatchList[i];
					if(course.id == currentMatchId){
						if(course.lessonId !='' && course.teachItemId !='' && course.teacherId !='' && 
								course.labId !='' && course.gradeId != ''){
							//更新底部table，全部对应成功
							course.allMatch = 1;
							$('#tr'+course.id+" td").eq(9).html('<span class="matchOK">对应成功</span>');
						}	
					}
				}
			} 
			
			/**
			* 检查是否已经比对成功
			*/
			function checkIsMatched(currentMatchId){
				for(var i =0;i<unmatchList.length;i++){
					var course = unmatchList[i];
					if(course.id == currentMatchId && course.allMatch == 1){
						 return true;
					}
				}
				return false;
			} 
			
			function getMatchItem(id){
				for(var i =0;i<unmatchList.length;i++){
					var course = unmatchList[i];
					if(course.id == id){
						 return course;
					}
				}
				return null;
			}

		</script>
 </body>
 <script>
 	var unmatchList =new Array();
	<c:forEach items="${unmatchedList}" var="c">
		unmatchList.push({
			id:'${c.id}',
			lessonId:'${c.lessonInfo.id}',
			teachItemId:'${c.teachItem.id }',
			teacherId:'${c.teacher.id }',
			labId:'${c.lab.id }',
			gradeId:'${c.grade.id}',
			allMatch:${c.isMatched},
			lessonName:'${c.lessonName}',
			teachItemName:'${c.teachItemName}',
			labName:'${c.labName }',
			teacherName:'${c.teacherName}',
			gradeInfo:'${c.gradeInfo}', 
			matchLessonName:'${c.lessonInfo.lessonName}',
			matchGradeName:'${c.grade.className}',
			matchLabName:'${c.lab.name}',
			matchTeacherName:'${c.teacher.realName}',
			matchTeachItemName:'${c.teachItem.itemName}',
		});
	</c:forEach>
 </script>
 
  
 